import { createComponent } from "./create-component"

export const ToastAnatomy = createComponent((props) => {
  const { palette, ...rest } = props
  return (
    <svg
      width={400}
      height={300}
      viewBox="0 0 400 300"
      fill="none"
      xmlns="http://www.w3.org/2000/svg"
      {...rest}
    >
      <rect
        x={61}
        y={150}
        width={279}
        height={46.002}
        rx={5}
        fill={palette[3]}
      />
      <path
        fillRule="evenodd"
        clipRule="evenodd"
        d="M76 173.001C76 170.516 78.0147 168.501 80.5 168.501H201.5C203.985 168.501 206 170.516 206 173.001C206 175.486 203.985 177.501 201.5 177.501H80.5C78.0147 177.501 76 175.486 76 173.001Z"
        fill={palette[15]}
      />
      <path
        d="M309.291 179.294C309.104 179.481 308.999 179.736 308.999 180.001C308.999 180.266 309.104 180.52 309.292 180.708C309.479 180.895 309.734 181.001 309.999 181.001C310.264 181.001 310.519 180.895 310.706 180.708L316.881 174.534C316.896 174.518 316.915 174.506 316.935 174.497C316.955 174.489 316.977 174.485 316.999 174.485C317.021 174.485 317.042 174.489 317.063 174.497C317.083 174.506 317.101 174.518 317.117 174.534L323.291 180.709C323.384 180.802 323.495 180.875 323.616 180.926C323.737 180.976 323.867 181.002 323.999 181.002C324.13 181.002 324.26 180.976 324.381 180.926C324.503 180.876 324.613 180.802 324.706 180.709C324.799 180.616 324.872 180.506 324.923 180.385C324.973 180.263 324.999 180.133 324.999 180.002C324.999 179.871 324.973 179.741 324.923 179.619C324.873 179.498 324.799 179.388 324.706 179.295L318.532 173.118C318.517 173.103 318.504 173.084 318.496 173.064C318.487 173.044 318.483 173.022 318.483 173C318.483 172.978 318.487 172.957 318.496 172.936C318.504 172.916 318.517 172.898 318.532 172.882L324.707 166.708C324.895 166.52 325 166.265 325 166C325 165.734 324.894 165.48 324.706 165.293C324.519 165.105 324.264 165 323.999 165C323.733 165 323.479 165.106 323.291 165.294L317.117 171.467C317.101 171.482 317.083 171.495 317.063 171.503C317.042 171.512 317.021 171.516 316.999 171.516C316.977 171.516 316.955 171.512 316.935 171.503C316.915 171.495 316.896 171.482 316.881 171.467L310.706 165.294C310.613 165.201 310.503 165.127 310.382 165.077C310.26 165.026 310.13 165.001 309.999 165C309.734 165 309.479 165.106 309.292 165.293C309.104 165.481 308.999 165.735 308.999 166C308.999 166.266 309.104 166.52 309.291 166.708L315.465 172.882C315.481 172.898 315.493 172.916 315.502 172.936C315.51 172.957 315.514 172.978 315.514 173C315.514 173.022 315.51 173.044 315.502 173.064C315.493 173.084 315.481 173.103 315.465 173.118L309.291 179.294Z"
        fill={palette[15]}
      />
      <rect
        x={61}
        y={209}
        width={279}
        height={46.002}
        rx={5}
        fill={palette[3]}
      />
      <path
        fillRule="evenodd"
        clipRule="evenodd"
        d="M76 232.001C76 229.516 78.0147 227.501 80.5 227.501H201.5C203.985 227.501 206 229.516 206 232.001C206 234.486 203.985 236.501 201.5 236.501H80.5C78.0147 236.501 76 234.486 76 232.001Z"
        fill={palette[15]}
      />
      <path
        d="M309.291 238.294C309.104 238.481 308.999 238.736 308.999 239.001C308.999 239.266 309.104 239.52 309.292 239.708C309.479 239.895 309.734 240.001 309.999 240.001C310.264 240.001 310.519 239.895 310.706 239.708L316.881 233.534C316.896 233.518 316.915 233.506 316.935 233.497C316.955 233.489 316.977 233.485 316.999 233.485C317.021 233.485 317.042 233.489 317.063 233.497C317.083 233.506 317.101 233.518 317.117 233.534L323.291 239.709C323.384 239.802 323.495 239.875 323.616 239.926C323.737 239.976 323.867 240.002 323.999 240.002C324.13 240.002 324.26 239.976 324.381 239.926C324.503 239.876 324.613 239.802 324.706 239.709C324.799 239.616 324.872 239.506 324.923 239.385C324.973 239.263 324.999 239.133 324.999 239.002C324.999 238.871 324.973 238.741 324.923 238.619C324.873 238.498 324.799 238.388 324.706 238.295L318.532 232.118C318.517 232.103 318.504 232.084 318.496 232.064C318.487 232.044 318.483 232.022 318.483 232C318.483 231.978 318.487 231.957 318.496 231.936C318.504 231.916 318.517 231.898 318.532 231.882L324.707 225.708C324.895 225.52 325 225.265 325 225C325 224.734 324.894 224.48 324.706 224.293C324.519 224.105 324.264 224 323.999 224C323.733 224 323.479 224.106 323.291 224.294L317.117 230.467C317.101 230.482 317.083 230.495 317.063 230.503C317.042 230.512 317.021 230.516 316.999 230.516C316.977 230.516 316.955 230.512 316.935 230.503C316.915 230.495 316.896 230.482 316.881 230.467L310.706 224.294C310.613 224.201 310.503 224.127 310.382 224.077C310.26 224.026 310.13 224.001 309.999 224C309.734 224 309.479 224.106 309.292 224.293C309.104 224.481 308.999 224.735 308.999 225C308.999 225.266 309.104 225.52 309.291 225.708L315.465 231.882C315.481 231.898 315.493 231.916 315.502 231.936C315.51 231.957 315.514 231.978 315.514 232C315.514 232.022 315.51 232.044 315.502 232.064C315.493 232.084 315.481 232.103 315.465 232.118L309.291 238.294Z"
        fill={palette[15]}
      />
    </svg>
  )
})
